@use "mixins";
@use "variables";

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: url('assets/fonts/open-sans-v13-latin-ext_latin_cyrillic-ext_greek-ext_greek_cyrillic_vietnamese-300.woff2') format('woff2');
  }
  
  @font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 300;
    src: url('assets/fonts/open-sans-v13-latin-ext_latin_cyrillic-ext_greek-ext_greek_cyrillic_vietnamese-300italic.woff2') format('woff2');
  }
  
  @font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url('assets/fonts/open-sans-v13-latin-ext_latin_cyrillic-ext_greek-ext_greek_cyrillic_vietnamese-regular.woff2') format('woff2');
  }
  
  @font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 400;
    src: url('assets/fonts/open-sans-v13-latin-ext_latin_cyrillic-ext_greek-ext_greek_cyrillic_vietnamese-italic.woff2') format('woff2');
  }
  
  @font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: url('assets/fonts/open-sans-v13-latin-ext_latin_cyrillic-ext_greek-ext_greek_cyrillic_vietnamese-600.woff2') format('woff2');
  }
  
  @font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 600;
    src: url('assets/fonts/open-sans-v13-latin-ext_latin_cyrillic-ext_greek-ext_greek_cyrillic_vietnamese-600italic.woff2') format('woff2');
  }

@font-face {
    font-family: 'Metropolis';
    font-style: normal;
    font-weight: 600;
    src: url('assets/fonts/Metropolis-SemiBold.woff') format('woff');
}

@font-face {
    font-family: 'Metropolis';
    font-style: italic;
    font-weight: 600;
    src: url('assets/fonts/Metropolis-SemiBoldItalic.woff') format('woff');
}

@font-face {
    font-family: 'Metropolis';
    font-style: normal;
    font-weight: 400;
    src: url('assets/fonts/Metropolis-Regular.woff') format('woff');
}

@font-face {
    font-family: 'Metropolis';
    font-style: italic;
    font-weight: 400;
    src: url('assets/fonts/Metropolis-RegularItalic.woff') format('woff');
}

@font-face {
    font-family: 'Metropolis';
    font-style: normal;
    font-weight: 300;
    src: url('assets/fonts/Metropolis-Light.woff') format('woff');
}

@font-face {
    font-family: 'Metropolis';
    font-style: italic;
    font-weight: 300;
    src: url('assets/fonts/Metropolis-LightItalic.woff') format('woff');
}

@font-face {
  font-family: 'FontAwesome';
  font-style: normal;
  font-weight: 300;
  src: url('assets/fonts/fontawesome-webfont.woff') format('woff');
}

b,
strong {
    font-weight: 600;
}

a {
    color: variables.$primary-color;
    cursor: pointer;
    text-decoration: none;
    word-break: break-word;

    &:focus,
    &:hover {
        color: variables.$primary-color--hover;
    }
}

body {
    @include mixins.font-smoothing;

    font-family: 'Open Sans', sans-serif;
}

h1,
h2,
h3 {
    font-family: Metropolis, sans-serif;
}

h1 {
    font-weight: 600;
}

label {
    &.has-error {
        color: variables.$red;
        font-weight: normal;
    }
}

.small {
    font-size: 12px;
}

.light {
    opacity: 0.73;
}

ul,
ol {
    padding-left: 22px;
    margin-top: 3px;
    margin-bottom: 0.11em;
}
